<link rel="stylesheet" href="/css/my-index.css?v=3">
<style>
    .erweima{
        left: 0.5rem;
        top: 1.98rem;
        line-height: 0.51rem;
        position: absolute;
    }
    #barcode{
        width: 87%;
    }
    .big-box{
        width: 100%;
        height: 10.8rem;
        overflow-y: scroll;
    }
</style>
<div class="big-box">
    <div class="my-beijing">
        <div class="touxiang" style="width: 100%;position: absolute;">
            <div class="handler_headimgurl">
                <?php if($this->headimgurl){?>
                    <img class="headimgurl" src="<?php echo $this->headimgurl;?>">
                <?php }else{?>
                    <img class="headimgurl" src="http://ziyan-image.oss-cn-hangzhou.aliyuncs.com/front/my/hend.png">
                <?php }?>
            </div>
            <div class="nickname"><?php echo $this->nickname;?></div>
        </div>

        <div class="paiming">
            <div class="pai-title">总排名</div>
            <div class="pai-number"><?php echo $this->totalInfo['total_sort'] > 0 && $this->totalInfo['total_score'] >0 ? $this->totalInfo['total_sort'] : '--';?></div>
        </div>
        <div class="paiming">
            <div class="pai-title">总积分</div>
            <div class="pai-number"><?php echo $this->totalInfo['total_score']> 0 ? $this->totalInfo['total_score'] : '--';?></div>
        </div>
        <div class="paiming">
            <div class="pai-title">周排名</div>
            <div class="pai-number"><?php echo $this->totalInfo['sort'] > 0 && $this->totalInfo['score'] > 0 ? $this->totalInfo['sort'] : '--';?></div>
        </div>
        <div class="paiming">
            <div class="pai-title">周积分</div>
            <div class="pai-number"><?php echo $this->totalInfo['score'] > 0 ? $this->totalInfo['score'] : '--';?></div>
        </div>
    </div>
    <div class="tap">
        <div class="tap-zong">我的竞猜</div>
        <div class="tap-zhou tap-xuanzei">我的奖品</div>
    </div>
    <div class="jiangpin">
        <?php if(empty($this->productList) && empty($this->winningList)){?>
            <div class="empty_con">空空如也~加入竞猜赢大奖吧~</div>
        <?php }else{?>
            <?php if(!empty($this->productList)){?>
                <?php foreach ($this->productList as $item){?>
                    <div class="jp-list">
                        <img src="http://ziyan-image.oss-cn-hangzhou.aliyuncs.com/front/my/gg.png" alt="">
                        <img src="<?php echo $item['portrait'];?>" style="width: 1.5rem;height: 1.55rem;position: absolute;z-index: 11;right: 4rem;">
                        <div class="jine-name"><?php echo $item['name'];?></div>
                        <div class="jine-data"><?php echo $item['insert_time'];?></div>
                        <div class="wanshan" data-title="<?php echo $item['name'];?>" data-id="<?php echo $item['id'];?>" onclick="showAddress(this)"></div>
                    </div>
                <?php }?>
            <?php }?>

        <?php }?>
        <?php $style = "" ?>
        <?php if(!empty($this->winningList)){?>
            <?php foreach ($this->winningList as $item){?>
                <div class="jp-list">
                    <?php if($item['coupon_type'] == 1){?>
                        <?php if($item['status'] == 1){ ?>
                            <img src="http://ziyan-image.oss-cn-hangzhou.aliyuncs.com/front/shouye/5juan.png" alt="">
                            <div class="used"> <img src="http://ziyan-image.oss-cn-hangzhou.aliyuncs.com/front/shouye/used.png"></div>
                            <?php $style = "style='color:rgba(87,87,87,1)' " ?>
                        <?php }else{ ?>
                            <img src="http://ziyan-image.oss-cn-hangzhou.aliyuncs.com/front/my/wu.png" alt="">
                        <?php } ?>

                    <?php }else if($item['coupon_type'] == 2){?>
                        <img src="http://ziyan-image.oss-cn-hangzhou.aliyuncs.com/front/my/sanshi.png" alt="">
                    <?php }else if($item['coupon_type'] == 3){?>
                        <img src="http://ziyan-image.oss-cn-hangzhou.aliyuncs.com/front/my/wushi.png" alt="">
                    <?php }?>

                    <div class="jine-name" <?php echo $style;?>><?php echo $item['memo']?></div>
                    <div class="jine-data"><?php echo $item['insert_time']?></div>
                    <?php if($item['coupon_id'] == 0){?><!--跳转链接-->
                        <div class="duihuan jump" onclick="count_clic(<?php echo $item['coupon_type'];?>)" data-id="<?php echo $item['link_url']?>"></div>
                    <?php }else{?>
                        <div class="duihuan code" data-id="<?php echo $item['coupon_code']?>"></div><!--弹出兑换框-->
                    <?php }?>
                </div>
            <?php }?>
        <?php }?>
    </div>
</div>
<div class="jp-zhezao">
    <!--    code码-->
    <div class="jp-juan">
        <div class="erweima">
            <img  id="barcode">
        </div>
        <div class="jp-code"></div>
        <div class="jp-juan-cha"></div>
    </div>
    <!--  完善资料  .-->
    <div class="jp-wanshann">
        <!--        <div class="jp-code"></div>-->
        <div class="jp-juan-cha"></div>
    </div>
</div>

<div class="op_address_div" id="address_div">
    <div class="address_div">
        <div class="tip_close"></div>
        <div class="tip_content">
            <div class="address_box">
                <div class="address_title" id="address_title"></div>
                <div class="address_subtitle">请完善个人信息进行奖品领取</div>
                <div id="address_box"></div>
            </div>
        </div>
        <div class="tip_tip">
            资料一经提交无法修改，主办方将核实资料真实性。<br>
            活动结束后统一发放奖品，疑问请致电活动客服。<br>
            客服热线：400-888-6517
        </div>
        <div class="address_submit" rel="0" onclick="subAddress(this)"></div>
    </div>
    <div class="address_success">
        <div class="zhidao"></div>
    </div>
</div>

<script>
    $(function () {
        var u = navigator.userAgent;
        if (u.indexOf('Android') > -1 || u.indexOf('Linux') > -1) {//安卓手机

            $('.big-box').css({'height':'12.34rem'})
        }
    })
    function count_clic(type) {
        $.ajax({
            type: 'post',
            url: "/my/count-click",
            data:{"type":type},
            dataType: 'json',
            success: function(response){
                if (response.code == 200){
                    console.log(response);
                }
            }
        });
    }
    $(".tip_close,.zhidao").on('click',function () {
        $("#address_div").hide();
        show_loading();
        window.location.reload();
    });
    $('.tap-zong').click(function () {
        show_loading();
        window.location.href = '/my/index';
    });
    $('.jump').click(function () {
        show_loading();
        var url= $(this).attr('data-id');
        window.location.href = url;
    });
    $('.code').click(function (e) {
//        var top = 0;
//        var clientY = e.clientY;
//        var el_h = $(this).offset().top;
        //var window_h = $(".layout_body").height();
//        var dialog_h = $('.jp-zhezao').find('.jp-juan').height();
//
//        if ((dialog_h / 2 + el_h) > window_h) {
//            top = window_h - dialog_h -200;
//        } else {
//            top = el_h - dialog_h / 2;
//        }
//        top = top < 225 ? 225 : top;

//        top = el_h - clientY;
//        alert(top);
//
//        $('.jp-zhezao').find('.jp-juan').css('top',top/220+'rem');

        var coupon_code = $(this).attr('data-id');
        $('.jp-zhezao,.jp-juan').show();
        document.addEventListener('touchmove',function (event) {
            event.preventDefault();
            window.event.returnValue=false;
        },false);
        var code = coupon_code;
        $('.jp-zhezao,.jp-juan').children('.jp-code').text(coupon_code);
        tiaoma(code);
    });
    $('.jp-juan-cha').click(function () {
        $('.jp-zhezao,.jp-juan').hide();
        document.addEventListener('touchmove',function (event) {
            window.event.returnValue=true;
        },false);
    });

    /*$('.wanshan').click(function () {
        $('.jp-zhezao,.jp-wanshann').show();
    });*/
    function tiaoma(code) {
        var barcode = document.getElementById('barcode'),
            str = code,
            options = {
                width:2,
                height:45,
                format:"CODE128",
                displayValue:false,
                fontSize:18,
                textAlign:"center",

            };
        JsBarcode(barcode, str, options);//原生
//        $('#barcode').JsBarcode(string,options);//jQuery
    }
    $(function(){
        /*初始化*/
        var counter = 0; /*计数器*/
        var pageStart = 0; /*offset*/
        var pageSize = 6; /*size*/
        var isEnd = false;/*结束标志*/
        var isAjax = false;/*防止滚动过快，服务端没来得及响应造成多次请求*/
        var range = 1000;
        var totalHeight=0;
        //上拉加载
        $('.jiangpin').scroll(function(){
            /*滚动加载时如果已经没有更多的数据了、正在发生请求时，不能继续进行*/
            if(isEnd == true || isAjax == true){
                return;
            }
            var scrollHeight = $(this).scrollTop();//页面卷起的高度
            totalHeight = parseFloat($(window).height())+parseFloat(scrollHeight);//页面文档高度+页面卷起的高度页面卷起的高度
            if(($(document).height()-range) <= totalHeight && counter !== pageSize){
                counter ++;
                pageStart = counter * pageSize;
                getData(pageStart, pageSize);
            }
        });
        //请求加载更多信息
        function getData(offset,size){
            var  url = '/my/get-winning'+ '?offset=' + offset + '&size=' + size;
            $.ajax({
                type: 'GET',
                url: url,
                dataType: 'json',
                success: function(response){
                    console.log(response);
                    var data = response.result.list;
                    var sum = response.result.list.length;
                    var result = '';
                    /************业务逻辑块：实现拼接html内容并append到页面*****************/
                    /*使用for循环模拟SQL里的limit(offset,size)*/
                    for(var i=0; i< sum; i++){
                        result += '<div class="jp-list">';
                        if(data[i].coupon_type == 1){
                            result += '<img src="http://ziyan-image.oss-cn-hangzhou.aliyuncs.com/front/my/wu.png" alt="">';
                        }else if(data[i].coupon_type == 2){
                            result += '<img src="http://ziyan-image.oss-cn-hangzhou.aliyuncs.com/front/my/sanshi.png" alt="">';
                        }else if(data[i].coupon_type == 3){
                            result += '<img src="http://ziyan-image.oss-cn-hangzhou.aliyuncs.com/front/my/wushi.png" alt="">';
                        }
                        result += '<div class="jine-name">'+data[i].coupon_type_name+'</div>';
                        result += '<div class="jine-data">'+data[i].insert_time+'</div>';
                        if(data[i].coupon_id == 0){
                            result += '<div class="duihuan jump" data-id="'+data[i].link_url+'"></div>';
                        }else{
                            result += '<div></div>' +
                                '<div class="duihuan code" data-id="'+data[i].coupon_code+'"></div>';
                        }
                        result += '</div>';
                    }
                    $('.jiangpin').append(result);

                    /*******************************************/
                    if ( (offset + size) >= sum){
                        isEnd = true;
                    }
                },
                error: function(xhr, type){
                    alert('Ajax error!');
                }
            });
        }
    });

    function showAddress(el) {
        var id = $(el).attr('data-id');
        var title = $(el).attr('data-title');
        var top = 0;
        var el_h = $(el).offset().top;
        var window_h = $(".layout_body").height();
        var dialog_h = 800;

        if ((dialog_h / 2 + el_h) > window_h) {
            top = window_h - dialog_h -100;
        } else {
            top = el_h - dialog_h / 2;
        }
        top = top < 225 ? 225 : top;

        $("#address_div").find('.address_div').css('top',top/100+'rem');
        if(!id){
            return false;
        }
        $("#address_title").html(title);
        show_loading();
        $.ajax({
            url  : '/my/get-address',
            type : 'post',
            data : {},
            dataType : 'json',
            success : function (msg) {
                close_locading();
                if (msg.code === 200) {
                    $("#address_div").find('.address_submit').attr('rel',id);
                    $("#address_box").html(msg.result.htmlcode);
                    $("#address_div").show();
                    document.addEventListener('touchmove',function (event) {
                        event.preventDefault();
                        window.event.returnValue=false;
                    },false);
                } else {
                    layer.msg(msg.message);
                }
            }
        });
    }

    function subAddress(el) {
        var user_name = $("#user_name").val();
        var user_mobile = $("#user_mobile").val();
        var user_province = $("#user_province").val();
        var user_city = $("#user_city").val();
        var user_area = $("#user_area").val();
        var user_address = $("#user_address").val();

        if(!user_name || user_name === ''){
            layer.msg('请输入姓名');
            return false;
        }
        if(!user_mobile || user_mobile === ''){
            layer.msg('请输入联系电话');
            return false;
        }else{
            user_mobile = user_mobile.replace(/\s+/g,"");
            if(user_mobile.length !== 11){
                layer.msg('联系电话必须11位');
                return false;
            }
        }
        if(!user_province || user_province === ''){
            layer.msg('请选择所在的省市区');
            return false;
        }
        if(!user_city || user_city === ''){
            layer.msg('请选择所在的省市区');
            return false;
        }
        if(!user_area || user_area === ''){
            layer.msg('请选择所在的省市区');
            return false;
        }
        if(!user_address || user_address === ''){
            layer.msg('请输入详细地址');
            return false;
        }

        var province_name = $("#user_province").find("option:selected").text(); //地区三级联动
        var city_name = $("#user_city").find("option:selected").text();//地区三级联动
        var area_name = $("#user_area").find("option:selected").text();//地区三级联动
        $("#province_name").val(province_name);
        $("#city_name").val(city_name);
        $("#area_name").val(area_name);

        show_loading();
        $.ajax({
            url  : '/my/save-address',
            type : 'post',
            data : $("#addressForm").serialize(),
            dataType : 'json',
            success : function (msg) {
                close_locading();
                if (msg.code === 200) {
                    $('.address_success').show();
                    $(".address_div").hide();
                    document.addEventListener('touchmove',function (event) {
                        event.preventDefault();
                        window.event.returnValue=false;
                    },false)
                } else {
                    layer.msg(msg.message);
                }
            }
        });
    }
</script>